<!--

  内容区生产管理
  
-->

<template>
    <div class="contain">
         <el-row >
  
                   <el-button type="primary"
                    plain class="aa"
                    
                     >委派管理</el-button>
                   <el-button type="success" plain>工组管理</el-button>
                   <el-button type="info" plain>工序管理</el-button>
                   <el-button type="warning" plain>工序派工</el-button>
                   <el-button type="danger" plain>工序流程</el-button>
</el-row>
    <div class="tu">
            <img   class="s1" src="../../assets/green/shencan-1.png" />
            <img   class="s1 s2" src="../../assets/green/shencan-2.png" />
            <img   class="s1 s3" src="../../assets/green/shencan-3.png" />
            <img   class="s1 s4" src="../../assets/green/shencan-4.png" />
            <img   class="s1 s5" src="../../assets/green/shencan-5.png" />
           
                <span class="kuang">MRP</span>
                <span class="kuang kuang-1">生产计划</span>
                <span class="kuang kuang-2">领料单</span>
                <span class="kuang kuang-3">退料单</span>
                 <span class="kuang kuang-4">维修领料单</span>
                  <span class="kuang kuang-5">维修单</span>
    </div>


    </div>
</template>

<script>
export default {

}
</script>

<style lass="scss" scoped>
    .contain{
        height: 100%;
    }
      .aa{
        margin-left:60px
    }
  .el-button{
       margin-top: 20px;
    color: #b0b0b0;
    background: #5a5a5a;
    border-color: #5a5a5a;
        transition: 1.1s;
   }
    .tu{
    position: relative;
    height: 88%;
    width:72%;
  
    }
    .s1{
    position: absolute;
    width: 15.092%;
    height: 43.912%;
    top:21%;
    left:8%;
    cursor: pointer;
    }
    .s2{
        left:24.5%;
    }
    .s3{
         left:41%;
    }
    .s4{
    left: 57%;
    top: 20%;
       width: 15.093%;
    height: 34.782%;
    cursor: pointer;
    }
     .s5{
    left: 72%;
    top: 20%;
     width: 15.093%;
    height: 34.782%;
    cursor: pointer;
     }
     .kuang{
    height: 12%;
    width: 10%;
    background: #5f5d5e;
    position: absolute;
    text-align: center;
    line-height:53px;
    font-size: 13px;
    color: #d6d6d6;
    border: 1px solid #838182;
    border-radius: 6%;
    font-weight: 400;
    bottom: 11%;
    left:7%;
    cursor: pointer;
    box-shadow: 0 6px 6px #888888;
     }
     .kuang-1{
    bottom: -4%;
    background-color: #b7b7b7;
    border: none;
    color: #f3f3f3;
     }
     .kuang-2{
         left: 24%;
     }
     .kuang-3{
         bottom: -4%;
    background-color: #b7b7b7;
    border: none;
      left: 24%;
      color: #f3f3f3;
     }
     .kuang-4{
          left:42%;
     }
      .kuang-5{
          left:42%;
              bottom: -4%;
    background-color: #b7b7b7;
    border: none;
  
      color: #f3f3f3;
     }
</style>
